/* @font-face {
  font-family: roboto;
  src: url('../img/fonts/Roboto/Roboto-Regular.ttf');
} */
html{width: 100%;height: 100%;}
 body {
  margin: 0;
  padding: 0;

  transform-origin: 0 0;       /*指定缩放的基本点*/
  -moz-transform-origin: 0 0 0;
  -ms-transform-origin: 0 0 0;
  -webkit-transform-origin: 0 0 0;
  -o-transform-origin: 0 0 0;
  overflow: hidden;
  font-family:roboto, Microsoft JhengHei , sans-serif !important;
  color: #ffffff;
     width: 100%;
     height: 100%;
     
     /* background-color: #15181d !important; */
     background-size: 100% 100%;
}
::-webkit-scrollbar-thumb {
    background-color: #fff;
}
#app {
  /*font-family: 'Avenir', Helvetica, Arial, sans-serif;*/
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0px;
  width: 1920px;
  height: 1080px;
  transform-origin: 0 0;    position: absolute;
}
body {

  transform-origin: 0 0;
  background-size: cover;
  -webkit-print-color-adjust: exact;
  font-family: roboto, Microsoft JhengHei , sans-serif !important;

}

a{color: #fff;text-decoration: none; font-size: 22px;}

/*正常機台細分欄位顏色*/
.bg_40B833_w{background-color: #40B833!important}/*上下料時待料機台顏色*/
.bg_40B833 {    background-color: #40B833!important}/*加工機台顏色*/
.bg_cc33ff {    background-color: #CC33FF!important}/*待料機台顏色*/
.bg_0084ff {    background-color: #0084ff!important}/*調機機台顏色*/
.bg_9422ff {    background-color: #9422ff!important}/*暖機機台顏色*/
/* fontColors */
.font_black {    color: #000 !important;}
.font_white {    color: #FFF !important;}
.font_green {    color: #92d050 !important;}
.font_yellow {    color: #efea3a !important;}
.font_cyan {    color: #19bf99 !important;}
.font_red {    color: #ff4459 !important;}
.font_gray {    color: #7e7d7f !important;}
.font_orange {    color: #e98401 !important;}
.font_blue {    color: #0087ff !important;}
.font_pink {    color: #ff00ff !important;}
.font_purple {    color: #ff00ff !important;}
.font_darkpurple {    color: #9422ff !important;}
.font_lightgreen {    color: #40b833 !important;}
.font_lightyellow {    color: #fff45c !important;
}

.font_darkblue {
    color: #003f73 !important;
}

@keyframes red_light
{
    0%   {background: rgba(255,68,89,1);}
    50%  {background: rgba(255,68,89,0.3);}
    100% {background: rgba(255,68,89,1);}
}
@keyframes yellow_light
{
    0%   {background: rgba(239, 234, 58,1);}
    50%  {background: rgba(239, 234, 58,0.3);}
    100% {background: rgba(239, 234, 58,1);}
}
@keyframes blue_light
    {
      0%   {background: rgba(64, 184, 51,1);}
      50%  {background: rgba(64, 184, 51,0.3);}
      100% {background: rgba(64, 184, 51,1);}
    }
/* cnc 狀態顯示 */
/* .cnc div { background: #003f73; } */

.cnc div { background: #2d9d23; }
.cncBlueBling div { background: #40b833; animation: blue_light 1s infinite;}
.cncRedBling div { background: rgba(255,68,89,1); animation: red_light 1s infinite; }
.cncRedBling div:hover { background: #a40000; animation: red_light none; }
.cncRed div{background: rgba(255,68,89,1);}
.cncOrange div { background: #e98401; }
.cncYellow div { background: #efea3a; color: #000 !important; }
.cncYellowBling div { background: #efea3a; color: #000 !important;animation: yellow_light 1.5s infinite; }
.cncCyan div{ background-color: #FFEB97 ;color: #000 !important;}
.cncGray div { background: #7e7d7f; }
.processing div{background: #40B833!important}
.adjusting div{background: #0084ff!important}
.warming div{background: #9422ff!important}

.block {
    display: block !important;
}
.noselected div{
  background: transparent;
  color:transparent !important;
}
/*.cnc div{background:#efea3a}*/

.panel {
    width: 1863px;
    height: 989px;
    margin: 23px auto;
    background: linear-gradient(180deg, #1f2331, #28384c);
    
}

.pos_r {
    position: relative;
}
.pos_a {
    position: absolute;
}
.none {
    display: none;
}
/* bgColors */
@keyframes red_light
{
    0%   {background: rgba(255,68,89,1);}
    50%  {background: rgba(255,68,89,0.3);}
    100% {background: rgba(255,68,89,1);}
}
.bg_blue {
    background: #0084ff !important;
}

.bg_green {
    background: #92d050;
}

.bg_yellow,.normalWaiting,.expireWaiting {
    background: #efea3a !important;
    color: #000 !important;
}

.bg_red {
    background: rgba(255,68,89,1);
}
.devAlarm,.toolAlarm {
    background: rgba(255,68,89,1)!important;
}

.bg_redBling {
    background: rgba(255,68,89,1);
    animation: red_light 1s infinite;
}

.bg_lightred {
    background: #ff4459 !important;
}

.cncBox .bg_red {
    background: rgba(255,68,89,1);
    animation: red_light 1s infinite;
}

.bg_red:hover,.bg_redBling:hover {
    background: #a40000;
    animation: red_light none;
}

.bg_gray {
    background: #7e7d7f !important;
}

.bg_lightgray {
    background: #b5b5b5;
}

.bg_orange {
    background: #e98401 !important;
}

.bg_pink {
    background: #ff00ff;
}

.bg_purple {
    background: #ff00ff;
}

.bg_darkpurple {
    background: #9422ff;
}

.bg_lightgreen {
    background: #40b833;
}

.bg_lightyellow {
    background: #fff45c;
    color: #000 !important;
}

.bg_darkblue {   
    background: #2d9d23 !important;

}


.bg_darkgreen {
    background: #2d9d23 !important;
} */


.bg_darkgray {    background: #434343;}

.bg_cyan{    background-color: #FFEB97 !important; color: #000 !important;}
/*佈局放大縮小拖動20201103*/
.zoomSwitch{
    background: #7e7d7f url(../img/icon_sliderControlArr.png) no-repeat center center;
    width: 31px;
    height: 60px;
    top: 23px;
    left: 29px;
    transform: rotate(180deg);
    cursor: pointer;
    margin: 0px;
    position: absolute;
    z-index: 998;}
.machineSlideBox{overflow: hidden;width: 1550px;float: left; height:705px; margin: 25px 0 0 10px;}
.machinePanelMove{margin:  0 !important;transform: scale(0.792);width: 1960px;transform-origin: 0 0;padding: 0 0 0 0px;top: 34px;}
.machineZoomBox{width: 31px;left: 30px;top: 86px;z-index: 99;display: none;}
.machineZoomBox div{width: 30px; height:30px; margin: 0 5px 4px 0; }
.machineZoomBox .zoomIn{ background: url('../img/zoomin.png');background-size: cover; cursor: pointer;display: inline-block;}
.machineZoomBox .zoomOut{ background: url('../img/zoomOut.png');background-size: cover; cursor: pointer; display: inline-block}
.machineZoomBox .zoomReset{ background: url('../img/icon_reset.png');background-size: cover; background-position: center;cursor: pointer;display: inline-block;
    background-color: white;border-radius: 14px;background-position: -2px 0;}

.factoryWhere .factoryName {
    letter-spacing: 12px;
}
.factoryName {
    font-size: 17px;
    margin: 0px 0 0 0;
}

.Zoomlayout {    width: 1980px;    height: 888px;    transform: scale(0.788);    transform-origin: 0 0;}
/* 機台CSS */
.cnc {    background: url('../img/cnc_normal.png') no-repeat;    width: 69px;    height: 38px;    cursor: pointer;
}
.nocnc {    width: 69px;    height: 38px;}
.cncLine {    width: 1560px;    border-bottom: 1px;    display: inline-block;    float: left;}
.cncLineSingleRow {    width: 1560px ;    height: 89px;    border-bottom: 1px;}
.lineTitle {    cursor: pointer;    font-size: 20px;    color: #fff;    width: 51px;    height: 28px;    float: left;    line-height: 28px;
    border: 0px solid #fff;    margin: 0;    text-align: center;}

/*20191028 modified by xi*/
.lineTitleCover {
    cursor: pointer;
    font-size: 20px;
    color: #fff;
    width: 51px;
    height: 28px;
    float: left;
    line-height: 28px;
    border: 2px solid #fff;
    margin: 40px 10px;
    text-align: center;
}

.cncBox {
    width: 1430px;
    height: 127px;
    column-count: 16;
    direction: rtl;
    list-style: none;
    border-bottom: 1px solid #aaaaaa;
    overflow: hidden;
}

.cncBox li:nth-child(even) {
    transform: rotate(180deg);
}

.cncBox li:nth-child(even) div {
    transform: rotate(180deg);
}

.cncBox li {
    margin: 0 0 38px 0;
}

.cncBoxSingleRow {
    width: 1485px;
    height: 54px;
    column-count: 19;
    direction: rtl;
    list-style: none;
    border-bottom: 1px solid #aaaaaa;
}

.cncBoxSingleRow li {
    margin: 0 0 38px 0;
}

.cNum {
    font-size: 22px;
    color: #fff;
    width: 52px;
    height: 34px;
    text-align: center;
    line-height: 36px;
    float: left;
    margin: 2px 0 0 2px;
}
/*其他頁面主顯示框*/
.listPanel {
    width: 1863px;
    height: 820px;background-color: #1b1e2f ;
    overflow: hidden;
}

.visibility { visibility: visible !important; }
.hidden { visibility: hidden !important; }
.none { display: none; }
.block { display: block !important; }

/**CNC彈窗*/
.closeBtn { background: url('../img/icon_close.png'); width: 33px; height: 33px; float: right; margin: 5px; cursor: pointer; }
.machineContent { width: 389px; height: 621px; float: left; background: #000; margin: 20px 0 20px 20px; }/*height原本值為569*/
.machineImg { width: 200px; height: 150px; background: url('../img/cncImg.jpg') no-repeat; margin: 20px; }

.machineImg2{ width: 200px; height: 150px;background: url('../img/Nutstosp焊接專用機.png') no-repeat;transform: scale(0.8);transform-origin: 0px 0px;margin: 20px;}
.machineRGVImg { width: 200px; height: 150px; background: url('../img/rgvImg.jpg') no-repeat; margin: 20px; }

/* nocnc彈窗   20230927*/
.nocncPopup .machineInfoScroll{ margin-top: 0px;height: 290px;top: -20px;}

/* 20191021 added by xi rgv圖片*/
.machinePLCImg { width: 200px; height: 150px; background: url('../img/plcImg.jpg') no-repeat; margin: 20px; }
/* 20191021 added by xi plc圖片*/
.machineContent .alarmInfo { margin: 0 0 0 120px; position: relative; top: 0px; width: 245px; height: 150px; overflow-x: hidden; overflow-y: auto; }
/* .alarmInfo ul {height: 115px;overflow-y: auto;} */

/*20191011 added by xi彈窗報警信息*/
.machineContent .alarmInfo li:nth-child(2n+1) { width: 80px; float: left; margin:  0 0 10px 0; }
.machineContent .alarmInfo li:nth-child(2n) { width: 110px; float: left; margin:  0 0 10px 45px; }
/*machineInfoScroll原本的css樣式 .machineInfo.machineInfo li divScroll { width: 351px; height: 327px; border: 1px solid #626262; margin: 0 auto; overflow-y: auto; }*/
/*machineInfoScroll現在的樣式*/
.machineInfoScroll {position: relative;top:20px ;width: 351px; height: 327px; border: 1px solid #626262; margin: 0 auto; overflow-y: auto; }
.machineInfoTitle { width: 353px; height: 30px; background: #626262; margin: 0 auto; text-align: center; line-height: 30px; letter-spacing: 10px; }

.machineInfo { margin: 20px; overflow: hidden; font-size: 24px; }
.machineInfo li { margin: 10px 0; }
.machineInfo li div { display: inline-block; width: 100px; }/*分散對齊text-align: justify; text-align-last: justify;*/
.machineInfo li div:last-child { width: 200px; color: #0087ff; }
.machineInfoScroll { width: 351px; height: 327px; border: 1px solid #626262; margin: 90px 0 0 20px; overflow-y: auto; }
.machineInfoTitle { width: 353px; height: 30px; background: #626262; margin: 0 auto; text-align: center; line-height: 30px; letter-spacing: 10px; }
/* scrollebar style */
.machineInfoScroll::-webkit-scrollbar,.infoContent::-webkit-scrollbar { width: 6px; background-color: rgba(0,0,0,0); position: absolute; right: 0; }
.machineInfoScroll::-webkit-scrollbar-thumb,.infoContent::-webkit-scrollbar-thumb { background-color: #fff; }
/*機台累計報警時長與加工數*/
.totalInformation{ width: 350px;height: 66px;position: relative;top: -35px;left: 17.5px}/*border: 1px solid orange;*/
.totalInformation li{ width: 350px;height: 30px;font-size: 24px;}
.banbie{ font-size: 20px;color: #0087ff}
#shichang{color: #0087ff}
#changliang{color: #0087ff}
#Span2{color: #0087ff}
#Span4{color: #0087ff}
/*CNC彈窗介面樣式*/
.infoContent { width: 636px; font-size: 24px; text-align: center; line-height: 43px; overflow-x: hidden; overflow-y: auto; position: relative; height: 525px; margin: 20px 0 0 20px; float: left; }
.infoContent li { width: 170px; float: left; margin: 5px 0; height: 43px; }
.infoContent li:nth-child(3n+1) { width: 290px; }
.infoContent li:nth-child(3n+1) label:first-child { font-size: 20px; margin: 0 5px; width: 90px; display: inline-block; line-height: 20px; vertical-align: middle; }
.infoContent li label { font-size: 20px; margin: 0 5px; width: 0px; display: inline-block; }
.infoContent li label:last-child { margin: 0 0 0 5px; }
.infoContent li p { width: 90px; height: 34px; text-align: right; font-size: 24px; display: inline-block; line-height: 28px; overflow: hidden; vertical-align: middle; }
.c11Popup .infoContent{ height: 477px;}
.infoContent li input { width: 100px; height: 34px; border: 3px solid #a1a1a1; text-align: center; font-size: 24px; color: #000; }
/*下限改為文本值*/
.infoContent li:nth-child(3n+3) { width: 150px; }
.infoContent li:nth-child(3n+3) p { width: 122px; height: 34px; text-align: right; font-size: 24px; display: inline-block; line-height: 28px; overflow: hidden; vertical-align: middle; }


.btn_ayNomal{    background: url(../img/btn_ay_nomal.png);
    width: 220px;
    height: 45px;
    display: block;
    position: absolute;
    bottom: 50px;
    left: 448px;
    margin: 0;
    cursor: pointer;
}

.btnSubmit {
    background: url(../img/btn_submit.png);
    background-position: center center;
    width: 220px;
    height: 45px;
    display: block;
    position: absolute;
    bottom: 20px;
    left: 68%;
    cursor: pointer;
}

/*公共消息弹窗*/
.popupInner {
    min-width: 350px;
    min-height: 200px;
    background: linear-gradient(#22242f, #2d3e52);
    text-align: center;
    color:#e1e1e1;    
    border: 2px solid rgba(255, 255, 255, .42);
    position: relative;
    top: -100px;
}
.popupInner .el-message-box__title{color:#e1e1e1;font-size: 24px;}
.popupInner .popTitle {
    width: 100%;        
    text-align: center;
    background: transparent;
}
.popupInner .btnStyle{  width: 161px;height: 43px;  border-radius: 3px;    font-size: 20px;background: #0084ff !important;
    border: none;
    font-weight: bold;
    letter-spacing: 1px;
    vertical-align: top;
    color: #fff;
    font-family: roboto, Microsoft JhengHei, sans-serif !important;}
.popupInner .el-message-box__btns{display: block;}
.popupInner .alertInfoMessage {
    text-align: center;
    font-size: 16px;
    line-height: 50px;
    margin: 10px;
    color:#e1e1e1;
}